/*
 * @Author       : wfl
 * @LastEditors  : wfl
 * @description  :
 * @updateInfo   :
 * @Date         : 2023-09-26 09:52:24
 * @LastEditTime : 2023-10-10 14:33:43
 */
.n-collapse {
  .n-collapse-item {
    margin-top: 0;

    .n-collapse-item__header {
      padding-top: 0;
      padding-left: var(--datav-gui-cp-title-padding-left);
      height: 40px;
      border-bottom: var(--datav-gui-cp-border);

      .g-field-title {
        cursor: pointer;
      }

      .n-collapse-item-arrow {
        position: absolute;
        right: 8px;

        .n-icon {
          font-size: 12px;
        }
      }
    }

    .n-collapse-item__content-wrapper {
      .n-collapse-item__content-inner {
        padding-top: 0;
        background-color: var(--datav-gui-bgcolor-back);
      }
    }

    &.--disabled {
      cursor: not-allowed;
      opacity: 0.5;
    }
  }
}

.g-field-collapse.n-collapse {
  .n-collapse-item {
    .n-collapse-item__header {
      padding-left: 8px;
      border-bottom-color: transparent;
    }

    .n-collapse-item {
      margin-left: 0;
    }
  }

  &.--disabled {
    .n-collapse-item {
      cursor: not-allowed;
      opacity: 0.5;
    }
  }

  & + .g-field-wp {
    padding-top: 8px;
  }
}

.g-field-collapse-panel {
  >.n-collapse-item__header {
    .g-field-collapse-panel-toolbox {
      color: var(--datav-font-color);
      margin-left: auto;
      margin-right: 32px;

      .toolbox-icon {
        margin-left: 6px;
        padding: 4px;
        width: 22px;
        height: 28px;
        line-height: 22px;
        transition: transform 0.3s ease-in-out;

        &:hover,
        &.--selected {
          color: var(--datav-main-color);
        }

        &.--icon-add:hover {
          transform: rotate(90deg);
        }

        &.--disabled {
          color: var(--datav-font-color-disabled);
          cursor: not-allowed;
        }
      }

      .g-field-collapse-panel-toolbox-split {
        margin-left: 6px;
        display: inline-block;
        width: 1px;
        height: 8px;
        border-left: 1px solid var(--datav-gui-border-color);
      }
    }
  }

  .n-collapse-item__content-inner {
    border-radius: 5px;
    margin: 5px;
    padding-top: 8px !important;

    .g-field-collapse {
      .g-field-title,
      .g-field-title-with-description {
        color: var(--datav-gui-font-color-3);
      }

      .n-collapse-item__header {
        .g-field-title,
        .g-field-title-with-description {
          color: var(--datav-gui-font-color-2);
        }

        .g-field-title {
          cursor: pointer;
        }
      }
    }
  }

  .g-field-collapse-panel-empty {
    padding: 12px;
    padding-left: 28px;
    font-size: 12px;
    color: var(--datav-gui-font-color-3);
    height: 40px;
    line-height: 40px;
  }
}
